<template>
	<view class="content">
		<view class="album-wrap" style="margin-top: 40upx" v-for="item in data">
			<view class="album-name">{{item.name}}</view>
			<image v-for="i in item.pictures" :style="{width:width*0.3066+'px',height:width*0.3066+'px'}" class="album-img" @click="showImg(i,item.pictures)"
				   mode="scaleToFill" :src="i"></image>
		</view>
	</view>
</template>
<script>
	import API from '../../common/api.js';
	export default {
		components: {
		},
		data() {
			return {
				data:[],
				width: uni.getSystemInfoSync().windowWidth,
			}
		},
		onLoad(option) {
			this.data=JSON.parse(option.data)
			console.log(this.data,999)
		},
		methods: {
			async getData(){
				uni.showLoading()
				let json = await API.buildPromotionDetail({
					"targetId": this.id,
					'token':'token'
				});
				if(json.status==200){
					this.data=json.data
				}else{
					uni.showModal({
						title: '提示',
						content: '加载失败',
						showCancel: false,
					});
				}
				uni.hideLoading()
			},
			showImg(url,data){
				uni.previewImage({
					current: url, // 当前显示图片的http链接
					urls:data // 需要预览的图片http链接列表
				})
			}
		}
	}
</script>

<style scoped>
	.content {
	}
	.album-wrap{
		display: flex;
		flex-wrap: wrap;
	}
	.album-name{
		color: rgba(155, 155, 155, 1);
		font-size: 30upx;
		width: 100%;
		padding-left: 20upx;
	}
	.album-img{
		margin-top:20upx;
		margin-left: 2%;
		border-radius: 12upx;
	}
</style>
